<script lang="ts" setup>
import { getSubmission, updateScore } from '@/api/homework';
import type { submissionForm } from '@/api/type';
import moment from 'moment';
import { onMounted, ref } from 'vue';
import { useRouter } from 'vue-router';
const props = defineProps(["id", "title"])
const homeworkList = ref<submissionForm[]>([])
const submission = async () => {
    let res = await getSubmission(props.id)
    homeworkList.value = res.data
    homeworkList.value.forEach(submission => {
        submission.formatDate = moment(submission.submissionDate).format("YYYY-MM-DD HH:mm:ss");
    });
}
const newScore = async (row: submissionForm) => {
    console.log("row==", row);
    let res = await updateScore(row);
    console.log("修改结果");

}
import { ArrowLeft } from '@element-plus/icons-vue'
import useCourseStore from '@/stores/course';
const router = useRouter();
const back = () => {
    useCourseStore().setActiveName("third")
    router.go(-1);
}
onMounted(() => {
    submission();
})
</script>
<template>
    <!-- 头部 -->
    <el-page-header :icon="ArrowLeft" @click="back" style="margin-left: 30px;">
        <template #content>
            <span> {{ title }} </span>
        </template>
    </el-page-header>
    <el-divider>
        <el-icon><star-filled /></el-icon>
    </el-divider>
    <div class="main">
        <el-table :data="homeworkList" stripe style="width: 75%;">
            <el-table-column label="序号" width="100">
                <template v-slot="{ $index }">
                    {{ $index + 1 }}
                </template>
            </el-table-column>
            <el-table-column prop="studentName" label="姓名" width="200" />
            <el-table-column prop="formatDate" label="提交时间" width="200"></el-table-column>
            <el-table-column label="作业文件" width="200">
                <template v-slot="{ row }">
                    <a :href="row.homeworkFile" download>附件查看/下载</a>
                </template>
            </el-table-column>
            <el-table-column prop="score" label="分数" width="200">
                <template v-slot="{ row }">
                    <el-input v-model="row.score" @keyup.enter.native="newScore(row)" />
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>

<style scoped>
.main {
    display: flex;
    height: auto;
    justify-content: center;
}
</style>
